<script>

import UniLink from "../../../../../uni_modules/uni-link/components/uni-link/uni-link.vue";
import UFormItem from "../../../../../uni_modules/uview-ui/components/u-form-item/u-form-item.vue";
import { uploadFile } from "../../../../../static/utils/uploadImg";
import { getCitysByProIdApi, getDistrictsByCityIdApi, getProvinceListApi } from "../../../../../api/common/location";
import {
  findAllPlan,
  getCustomerEntryDetail,
  getProjectInfoDetailApi,
  saveOrEditCustomerEntry
} from "../../../../../api/customer";
import { STATION_STATUS } from "../constant";
import DateSelect from "../../../../../components/base/date-select/index.vue";
import URow from "../../../../../uni_modules/uview-ui/components/u-row/u-row.vue";
import {AZIMUTH, PLAN_TYPE} from "../../../../../constant";
import UText from "../../../../../uni_modules/uview-ui/components/u-text/u-text.vue";
import {getAgentListApi, getElectricPlanAll} from "../../../../../api/common/power-station";
import material from "./material/index.vue";
import { filerImageUrlParams } from "../../../../../static/utils/handleImage";
import citySelect from "../../../../../components/business/city-select/index.vue";
import uSelect from "../../../../../components/base/u-select/index.vue";
import project from "./project/index.vue";
import house from "./house/index.vue";
import ModuleCard from "../../../../../components/business/module-card/index.vue";
import owner from "./owner/index.vue";
import {basePowerStationInfo} from "../../constant/power-station";
export default {
  name: "index",
  props: {
    stationId: {
      type: String,
      default: '',
    },
    disabled: {
      type: Boolean,
      default: false,
    }
  },
  computed: {
    PLAN_TYPE() {
      return PLAN_TYPE
    },
    AZIMUTH() {
      return AZIMUTH
    },
    editable() {
      return this.$props.disabled
    },
  },
  components: {
    ModuleCard,
    UText, URow, UFormItem, UniLink, DateSelect, material,
    citySelect, uSelect, project,house,owner,
  },
  // provide(){
  //   return {
  //     formData: this.formData,
  //   }
  // },
  data(){
    return {
      cityPickData: [],
      // projectListVisible: false,
      userId: '',
      // disabled: false,
      formData: {
        projectCode: '', // 产品编码
        projectName: '', // 产品名称
        projectId: '', // 产品id
        powerStationCode: null, // 电站编码
        companyId: '', // 所属公司
        payCycle: '', // 租金支付方式 1按月支付 2按季支付 3按年支付
        beianMode: 1, // 备案方式 0.自然人备案 1.项目公司备案
        beianCapacity: '', // 备案装机容量
        teamworkLimit: 0, // 合作年限 0、25年
        rentStandard: 0, // 租金标准：0.10元/块·年
        filingNumber: '', // 备案号
        createTime: '', // 登记时间
        tenantName: '', // 业主姓名
        mobile: '', // 联系电话
        idCode: '', // 身份证号
        address: '', // 业主地址
        longitude: '', // 经度
        latitude: '', // 纬度
        idCardFront: '', // 身份证正面
        idCardBack: '', // 身份证反面
        bankName: '', // 开户银行
        bankNumber: '', // 开户行行号
        bankBranch: '', // 开户支行
        bankCode: '', // 银行账号
        bankCard: '', // 银行卡照片
        projectCompanyId: '', // 所属项目公司id

        buildingStructure: '', // 房屋结构
        kingpostType: '', // 主梁类型
        roofType: '', // 屋顶类型
        houseType: '', // 房屋类型
        shootType: '', // 拍摄方式
        noFlyImgList: [], // 禁飞图片 返回来是列表
        noFlyImgs: '', // 禁飞图片
        noFlyImgs1: '', // 禁飞图片
        roofPhotoOne: '', // 屋顶照片
        roofValue: '', // 屋顶视频
        whitePaperPhoto: '', // 用户手持明白纸照片
        houseOwnership: '', // 房屋所有权
        houseOwnershipOne: '', // 房屋所有权
        houseOwnershipTwo: '', // 房屋所有权
        surveyRecord: '', // 踏勘记录
        surveyRecord2: '', // 踏勘记录
        buildingHeight: '', // 建筑高度
        repaymentMethod: '', // 还款方式
        filingDocumentPhoto: '', // 备案文件照片
        filingDocumentPhoto2: '', // 备案文件照片
        filingDocumentPhoto3: '', // 备案文件照片
        roofPhotoTwo: '', // 屋顶照片
        roofPhotoThree: '', // 屋顶照片
        roofPhotoFour: '', // 屋顶照片
        roofPhotoInterior: '', // 屋顶照片
        dimensionsPhotoThickness: '', // 尺寸照片
        roofPhotoFive: '', // 屋顶照片
        roofPhotoSix : '', // 屋顶照片

        schemeType: '', // 设计方案
        schemeTypeName: '', // 设计方案名称
        schemeTypeId: '', // 设计方案id
        schemeId: '', // 方案id
        componentSpec: '', // 组件规格
        distance: '', // 并网距离
        attach2: '', // 附件
        composePlanVOList: [
          {
            planType: '', // 方案类型
            name: '', // 方案名称
            attach: '', // 附件
            planId: '', // 方案id
          }
        ], // 设计方案
        designDrawings: '', // 设计图纸
        remarks: '', // 备注
        schemeRemarks: '', // 方案备注
        status: 0, // 状态 0.暂存
        itemList: [],
        componentNum: 0, // 组件数量
        generatorNo: '', // 户号
      },
      rules: [],
      show: false,
      showSchemeType: false,
      labelStyle: {'align-self': 'start', 'font-size': '14px'},
    }
  },
  watch: {
    formData: {
      handler(val) {
        this.$forceUpdate();
      },
      deep: true,
    },
    stationId(val) {
      if (val) {
        this.id = val;
        this.getDetail(val);
      }
    },
  },
  onLoad(option){
    if (option.id) {
      this.id = option.id;
      this.getDetail(this.id);
    }
  },
  mounted() {
    this.getDetail(this.$props.stationId);
  },
  methods: {
    handleChange() {
      console.log('change')
    },
    // 获取详情
    async getDetail(id) {
      const { data } = await getCustomerEntryDetail(id);
      this.formData = Object.assign({}, this.formData, data);
      // 临时处理 todo...
      let arr = this.formData.noFlyImgList || [];
      if (arr.length > 0) {
        this.formData.noFlyImgs = arr[0];
      } else {
        this.formData.noFlyImgs = '';
      }
      if (arr.length > 1) {
        this.formData.noFlyImgs1 = arr[1];
      } else {
        this.formData.noFlyImgs1 = '';
      }
    },
    // 处理禁飞图片 临时方案
    handleNoflyImage(data) {
      const arr = [];
      data.noFlyImgs && arr.push(data.noFlyImgs);
      data.noFlyImgs1 && arr.push(data.noFlyImgs1);
      data.noFlyImgs = arr.join(',');
    },
    // 暂存
    async save() {
      console.log(this.formData)
      this.filterItemList();
      this.filterComposePlanVOList();
      this.formData.status = STATION_STATUS.TEMP;
      const cloneData = JSON.parse(JSON.stringify(this.formData));
      console.log(cloneData)
      this.handleNoflyImage(cloneData)
      filerImageUrlParams(cloneData);
      const { data } = await saveOrEditCustomerEntry(cloneData);
      uni.showToast({
        title: '暂存成功',
        icon: 'none',
        duration: 2000
      })
      // this.getDetail(this.id)
      // 重定向到编辑页面
      if (!this.id) {
        uni.redirectTo({
          url: `/pages/index/home/enter/edit/index?id=${data}`
        })
      }
    },
    // 过滤空composePlanVOList
    filterComposePlanVOList() {
      if (!this.formData.composePlanVOList) this.formData.composePlanVOList = [];
      this.formData.composePlanVOList = this.formData?.composePlanVOList?.filter(item => item.name !== '' || item.planType !== '' || item.attach !== '');
    },
    // 过滤空itemList
    filterItemList() {
      if (!this.formData?.itemList) {
        this.formData.itemList = [];
      }
      this.formData.itemList = this.formData?.itemList?.filter(item => item.itemTypeId !== '');
    },
    // 返回上一页
    cancel() {
      uni.navigateBack({
        delta: 1
      })
    },
  }
}
</script>

<template>
  <view class="container">
    <u--form
        labelPosition="left"
        :model="formData"
        :rules="rules"
        ref="uForm"
        labelWidth="100"
        :labelStyle="labelStyle"
    >
      <project :formData="formData" :disabled="editable"/>
      <owner v-model="formData" :disabled="editable" />
      <house v-model="formData" :disabled="editable" />

      <view class="module">
        <view class="cell module__title">
          <view class="cell-hd">
            <u-icon name="order" size="22"></u-icon>
          </view>
          <view class="cell-bd module__title__text">方案信息</view>
        </view>
        <material :formData="formData" />
        <u-form-item
            label="备注"
            prop="formData.schemeRemarks"
            ref="item1"
        >
          <u--textarea v-model="formData.schemeRemarks" placeholder="请输入备注" count border="none"></u--textarea>
        </u-form-item>
      </view>
    </u--form>
    <view class="cell footer" v-if="!disabled">
      <view class="cell-hd save"><u-button @click="cancel">取消</u-button></view>
      <view class="cell-bd submit"><u-button color="#dab386" type="primary" @click="save">暂存</u-button></view>
    </view>
  </view>
</template>

<style scoped lang="scss">
.container{
  background: #eee;
  padding-bottom: 76px;
}
.radio-group{

}
//样式穿透

/deep/ .u-form-item__body__left__content{
  align-self: flex-start;
}
/deep/ .u-radio{
  //margin-right: 15px;
}
.group-title{
	font-size: 14px;
	color: #113d48;
	margin-top: 15px;
	margin-bottom: 10px;
}
.module{
	margin-bottom: 10px;
	background-color: #fff;
	padding: 20px 20px 0px 20px;
  &:last-child{
    margin-bottom: 0px;
  }
	&__title{
		font-size: 16px;
		border-bottom: 1px solid #eee;
		color: #113d48;
		padding-bottom: 10px;
		&__text{
			margin-left: 5px;
		}
	}
}
.footer{
	position: fixed;
	left: 0px;
	right: 0px;
	bottom: 0px;
	z-index: 10;
	padding: 10px 5px;
	background: #fff;
	border-top: 1px solid #eee;
	.save{
		padding: 0 5px;
		button{
			min-width: 140px;
		}
	}
	.submit{
		padding: 0 5px;
		width: 100%;
	}
	button{
		margin: 0;
	}
}
.roof-subtitle{
  text-align: center;
  color: #888;
}
.mb-10{
  margin-bottom: 10px;
}
.ml-15{
  margin-left: 15px;
}
.plus{
  text-align: center;
  padding: 10px 0px 20px 0;
  border-bottom: 1px solid #eee;
  color: #888;
  .text{
    justify-content: center !important;
  }
}
</style>
